<template>
    <div>
        <el-page-header title="首页" @back="gotoRoute('/')" content="评测项目管理">
        </el-page-header>
        <el-divider></el-divider>
        <el-button-group>
            <el-button v-if="allowed([0])" size="mini" type="primary" @click="handEdit">新增</el-button>
        </el-button-group>
        <el-divider></el-divider>
        <el-table :data="tableData.rows" border class="w-100%">
            <el-table-column type="index" width="50">
            </el-table-column>
            <el-table-column prop="name" label="名称" width="250">
                <template slot-scope="scope">
                    <el-button @click="handSetting(scope.row.id, scope.row.group_type, scope.row.is_finished)"
                        type="primary" size="small">
                        {{ scope.row.name }}-设置
                    </el-button>
                </template>
            </el-table-column>
            <el-table-column prop="object_group_name" label="单位名称" width="200">
            </el-table-column>
            <el-table-column prop="group_type" label="企业类型" width="80">
                <template slot-scope="scope">
                    {{ scope.row.group_type == 1 ? '有' : '无' }}董事会
                </template>
            </el-table-column>
            <el-table-column prop="ef_year" label="测评年份" width="80">
            </el-table-column>
            <el-table-column v-if="allowed([0])" prop="is_start" label="状态" width="100">
                <template slot-scope="scope">
                    <template v-if="scope.row.is_finished">
                        已结束
                    </template>
                    <template v-else>
                        <el-button :disabled="scope.row.is_finished"
                            @click="toggleStart(scope.row.id, scope.row.is_start)"
                            :type="scope.row.is_start > 0 ? 'success' : 'info'">{{
                                scope.row.is_start > 0 ? '停止' : '启动'
                            }}</el-button>
                    </template>
                </template>
            </el-table-column>
            <el-table-column prop="start_time" label="开始时间" width="180">
            </el-table-column>
            <el-table-column prop="end_time" label="结束时间" width="180">
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="250">
                <template slot-scope="scope">
                    <el-button-group>
                        <el-button v-if="allowed([0])" @click="handEdit(scope.row)" type="success" size="small"
                            :disabled="scope.row.is_finished">编辑</el-button>

                        <el-button v-if="allowed([0])" @click="handRemove(scope.row)" :disabled="scope.row.is_finished"
                            type="danger" size="small">删除</el-button>

                    </el-button-group>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination background @current-change="handPage" layout="prev, pager, next" :total="tableData.count"
            :page-size="tableData.offset">
        </el-pagination>
    </div>
</template>

<script>
import { FormDialog } from '@formily/element'
import { InputForm } from './InputForm';
import { InputForm2 } from './InputForm2';
import { BaseApi } from '../../api/common/base-api';
import { sharedConfig } from '../shared/BaseCurd';
import { onFieldInfo } from '../../api/common/field-event'
import { onFieldValueChange } from '@formily/core';
import { useLoginStore } from '../../store';
const api = new BaseApi({ prefix: "/eva-project" });
const entity = {
    id: undefined,
    name: "",
    ef_year: "",
    short_name: "",
    object_group_id: "",
    object_group_name: "",
    start_time: new Date(),
    end_time: new Date(),
    group_type: 1,
    limit_time: 0,
    remark: "",
}
export default {
    name: "Pager",
    async mounted() {
        this.loadPager({ page: 1 });
    },
    methods: {
        ...sharedConfig.methods,
        async loadPager({ page }) {
            const param = { page, order: [["is_start", "DESC"], ["end_time", "DESC"]] };
            const store = useLoginStore();
            if (store.user_type === 1) {
                param.where = { object_group_id: store.group_id }

            }
            const data = await api.findPager(param);
            this.tableData = { ...data.data };
        },
        handEdit(row) {
            const store = useLoginStore();
            const iForm = store.user_type === 1 ? InputForm2 : InputForm;
            FormDialog('编辑项目', iForm)
                .forOpen((payload, next) => {
                    const raw = (row instanceof PointerEvent) ? entity : row;
                    if (store.user_type === 1) {
                        raw.object_group_id = store.group_id;
                        raw.object_group_name = store.group_name;
                    }
                    next({
                        initialValues: { ...raw },
                        effects(form) {
                            onFieldValueChange("object_group_info", (field, form) => {
                                onFieldInfo({ names: ['object_group_id', 'object_group_name'], field, form });
                            })
                        }
                    })
                })
                .forConfirm((payload, next) => {
                    next(payload)
                })
                .forCancel((payload, next) => {
                    next(payload)
                })
                .open()
                .then(async (values) => {
                    Reflect.deleteProperty(values, "object_group_info");
                    await this._save({ api, values })
                    await this.loadPager({ page: 1 });
                })
                .catch(console.error)
        },
        handRemove(row) {
            this.$confirm("确定要删除?", "系统提示").then(async () => {
                await this._remove({ api, where: { id: row.id } });
                await this.loadPager({ page: 1 });
            }).catch(console.error);

        },
        handSetting(id, group_type, is_finished) {
            this.$router.push({ name: "eva-project-setting", query: { id, group_type, is_finished } })
        },
        toggleStart(id, is_start) {
            this.$confirm("确定要" + (is_start > 0 ? "停止" : "启动") + "评测?", "系统提示").then(async () => {
                await api.update({ values: { is_start: is_start > 0 ? 0 : 1 }, where: { id } })
                await this.loadPager({ page: 1 });
            }).catch(console.error);
        }
    },

    data() {
        return {
            tableData: {
                count: 0,
                offset: 10,
                page: 1,
                rows: [],
            }
        }
    }
}
</script>